// 路由守卫文件
import router from './router'
import store from './store'
import NProgress from 'nprogress' //  进度条
import 'nprogress/nprogress.css' //  进度条的css样式
// 白名单 如果没有token只能访问白名单中的路由页面
const whiteList = ['/login', '/404']
// 前置路由守卫
router.beforeEach(async(to, from, next) => {
  NProgress.start()
  // 判断是否有token 如果有就代表已登录
  if (store.getters.token) {
    // 如果是已登录的情况下 那么就不能在访问登录路由页面了 强制跳转到首页
    if (to.path === '/login') {
      next('/') // 跳转到首页 next()中写路径 是不会执行后置路由守卫的 所有需要手动关闭进度条
      NProgress.done
    } else {
      // 如果访问的不是登录页面那就放行
      next()
      // 获取用户资料
      //  判断是否获取过资料
      // 如果没有userId这个属性代表着就是没有获取过资料
      //  vuex中的数据是存在内存中的刷新页面数据会丢失 所有这个判断用的很巧妙
      // 刷新页面数据丢失 userId为空  空为fasle取反为true 则会进入到以下这个判断中
      // 路由跳转是不会刷新页面的，这就意味着数据不会丢失
      if (!store.getters.userId) {
        await store.dispatch('user/getUserInfo')
      }
    }
  } else {
    // 如果跳转的路由路径 在白名单数组中有
    // to.path就是要跳转的路由路径
    if (whiteList.includes(to.path)) {
      next()
    } else {
      // 如果在白名单中没有 就跳转到登录页
      next('/login')
      NProgress.done()
    }
  }
})
// 后置路由守卫
router.afterEach((to, from) => {
  NProgress.done()
})
